<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:rich="http://richfaces.org/rich"
	xmlns:a4j="http://richfaces.org/a4j">

<ui:composition>
	<h:outputStylesheet library="css" name="pages_style.css"></h:outputStylesheet>
	<h:outputStylesheet library="css" name="pages/bookPresentation.css"></h:outputStylesheet>

	<rich:tabPanel switchType="client">
		<rich:tab header="Szczegóły książki">
			<h:panelGrid columns="1" style="width: 100%">
				<h:panelGroup>
					<h:outputText styleClass="titleClass"
						value="#{bookTableBean.selectedBook.title}" />
					<h:panelGrid columns="3" style="width: 100%"
						columnClasses="firstBookPresentationColumn, secondBookPresentationColumn">
						<h:column>
							<a4j:outputPanel id="gallery"
								style="position: relative; z-index: 3;float: left;">
								<!--									style="	z-index: 2; position: absolute; display: block;"-->
								<h:graphicImage width="160px" library="images"
									name="#{bookTableBean.selectedBook.bigIconURL}" alt="pic" />
							</a4j:outputPanel>

							<!--							<rich:jQuery selector="#gallery img"-->
							<!--								query="addClass('pic-normal')" />-->
							<!--							<rich:jQuery selector="#gallery img"-->
							<!--								query="wrap('&lt;div class=\'wrap1\'&gt;&lt;/div&gt;')" />-->
							<!--							<rich:jQuery selector="#gallery img" event="mouseover"-->
							<!--								query="jQuery(this).stop().animate({width:'326px'})" />-->
							<!--							<rich:jQuery selector="#gallery img" event="mouseout"-->
							<!--								query="jQuery(this).stop().animate({width:'160px'})" />-->

						</h:column>

						<h:column>
							<h:form>
								<br />
								Autorzy:
								<rich:list value="#{bookTableBean.selectedBook.author_list}"
									var="author">
									#{author.author_first_name} #{author.author_last_name}
									</rich:list>
							</h:form>
							<br /> Cena:
									<h:outputText value="#{bookTableBean.selectedBook.price}">
								<f:convertNumber type="currency" pattern="  #0.00 zł" />
							</h:outputText>
							<br /> Liczba stron: #{bookTableBean.selectedBook.pages}
					<br /> Wydawnictwo: #{bookTableBean.selectedBook.publisher}
					<br /> Rok wydania: #{bookTableBean.selectedBook.issue_year}
						</h:column>
						<h:column>
							<rich:panel bodyClass="addToCart">
							Dodaj do koszyka!
						</rich:panel>
						</h:column>
					</h:panelGrid>
				</h:panelGroup>

				<h:panelGroup>
					<h:outputText value="#{bookTableBean.selectedBook.long_descripton}"
						escape="false" />
				</h:panelGroup>

			</h:panelGrid>
		</rich:tab>
		<rich:tab header="Recenzje">
			<rich:list value="#{bookTableBean.reviewList}" var="review"
				type="definitions">

				<rich:panel headerClass="reviewHeader">
					<f:facet name="header">
						<h:outputText styleClass="reviewNick" value="#{review.nick}" />
						<h:outputText styleClass="reviewDate"
							value="Data: #{review.review_date}" />
					</f:facet>
               #{review.text}<br />
					<h:outputText value="Ocena: #{review.note}/10" style="float:right;" />
					<br />
					<br />
				</rich:panel>
			</rich:list>
			<h:form>
				<rich:panel rendered="#{clientLoginBean.logged}">
					<h:inputTextarea rows="3" cols="106"
						value="#{bookTableBean.review.text}" />
					<rich:inputNumberSlider value="#{bookTableBean.review.note}"
						width="500" maxValue="10" step="1" showArrows="true"
						showTooltip="false" />
					<h:commandButton value="Dodaj"
						actionListener="#{bookTableBean.addReview}" />
				</rich:panel>
			</h:form>

		</rich:tab>
	</rich:tabPanel>
</ui:composition>
</html>
